<template>
    <div class="modal-body pad">
        <div v-if="currentHealth && currentHealth.details">
            <h5>Properties</h5>
            <div class="table-responsive">
                <table class="table table-striped">
                    <thead>
                    <tr>
                        <th class="text-left">Name</th>
                        <th class="text-left">Value</th>
                    </tr>
                    </thead>
                    <tbody>
                    <tr v-for="(item, index) in currentHealth.details.details" :key="index">
                        <td class="text-left">{{index}}</td>
                        <td class="text-left">{{readableValue(item)}}</td>
                    </tr>
                    </tbody>
                </table>
            </div>
        </div>
        <div v-if="currentHealth && currentHealth.error">
            <h4>Error</h4>
            <pre>{{currentHealth.error}}</pre>
        </div>
    </div>
</template>

<script lang="ts" src="./health-modal.component.ts">
</script>
